<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ include file="/WEB-INF/views/include/constrant.jsp"%>
<jsp:include page="/WEB-INF/views/layouts/head.jsp"></jsp:include>
<html>
<head>
<title>按天包车</title>
<link href="${ctxStatic}/jquery-select2/3.4/fselect2.min.css" rel="stylesheet" />
<link rel="stylesheet" href="${ctxStatic }/index/css/daycars.css" />
<link href="${ctxStatic }/cityselector/cityselect.css" rel='stylesheet'type='text/css' />
<script src="${ctxStatic}/form-validate/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctxStatic }/index/js/xiake.js"></script>
<script type="text/javascript">
	$(function() {
		$("#bookingForm").validate({
			rules: {
				contacts: "required",
				"departcity.sitename":{
					required:true,
				},
				boardaddr:{
					required:true,
				},
				payertel:{
					required:true,
					isMobile : true
				}
			},
			messages: {
				contacts: "",
				"departcity.sitename": {
					required: ""
				},
				boardaddr: {
					required: ""
				},
				payertel: {
					required: "",
					isMobile : ""
				}
			}
		});
	        jQuery.validator.addMethod("isMobile", function(value, element) {
	            var length = value.length;
	            var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
	            return this.optional(element) || (length == 11 && mobile.test(value));
	        }, "请正确填写您的手机号码");
		var keyVal= "${message}";
		if(keyVal.length!=0){  
			alert(keyVal)  
			/* window.location.href = "${ctxFront}/indexDayRent";  */
			window.history.go(-1);  
		}  
		
	})
	var days = ${query.daysnum};
	var suitrtnprice = null;
	if(days==0){
		suitrtnprice = ${0.8*tRentproduct.suitrtnprice};
	}else{
		suitrtnprice = ${query.daysnum*tRentproduct.suitrtnprice};
	}
	$(function(){
		$('#purchasenum').on('change',function(){
			var integer = /^[0-9]*[1-9][0-9]*$/;
			var val = $(this).val();
			if(val!='' && !integer.test(val)) {
				$(this).focus();
				$('#suitrtnprice').text("￥车辆数不正确！");
			} else {
				var totalprice = accMul(val,suitrtnprice);
				$('#suitrtnprice').text("￥"+totalprice.toFixed(0));
			}
		});
		$('#purchasenum').trigger('change');
	}); 
	function accMul(arg1, arg2) {
		var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
		try {
			m += s1.split(".")[1].length;
		} catch (e) {
		}
		try {
			m += s2.split(".")[1].length;
		} catch (e) {
		}
		return Number(s1.replace(".", "")) * Number(s2.replace(".", ""))
				/ Math.pow(10, m);
	}
</script>
<script type="text/javascript">
	// 百度地图API功能
	function G(id) {
		return document.getElementById(id);
	}

	var map = new BMap.Map("l-map");

	var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
		{"input" : "suggestId"
		,"location" : map
	});

	ac.addEventListener("onhighlight", function(e) {  //鼠标放在下拉列表上的事件
	var str = "";
		var _value = e.fromitem.value;
		var value = "";
		if (e.fromitem.index > -1) {
			value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
		}    
		str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
		
		value = "";
		if (e.toitem.index > -1) {
			_value = e.toitem.value;
			value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
		}    
		str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
		G("searchResultPanel").innerHTML = str;
	});

	var myValue;
	ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件
	var _value = e.item.value;
		myValue = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
		G("searchResultPanel").innerHTML ="onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
		
		setPlace();
	});

	function setPlace(){
		map.clearOverlays();    //清除地图上所有覆盖物
		function myFun(){
			var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
			map.centerAndZoom(pp, 18);
			map.addOverlay(new BMap.Marker(pp));    //添加标注
		}
		var local = new BMap.LocalSearch(map, { //智能搜索
		  onSearchComplete: myFun
		});
		local.search(myValue);
	}
</script>
</head>
	<body><input type="hidden" id="menuInfo" value="indexDayRent">
		<div class="details_warp">
		<form id="bookingForm" action="${ctxFront}/sms/booking" method="post">	
			<div class="details_main">
				  <div class="de_page clearfix">
				  	   <div class="depage_left">
			<c:choose>
				<c:when test="${query.tabType eq '跨市'}" >
					<c:set var="destcityPart" value="跨市"/>
				</c:when>
				<c:otherwise><c:set var="destcityPart" value="市内"/></c:otherwise>
			</c:choose>
			<c:if test="${query.daysnum==0 }">
			<c:set var="genOrdername" value="${tRentproduct.departcity.sitename}${destcityPart}0.5日按天包车"/>
			</c:if>	
			<c:if test="${query.daysnum!=0 }">
			<c:set var="genOrdername" value="${tRentproduct.departcity.sitename}${destcityPart}${query.daysnum }日按天包车"/>
			</c:if>	
			
			<input type="hidden" name="ordername" value="${genOrdername }" />
			<input type="hidden" name="ordertype" value="${query.rentType }" />
			<input type="hidden" name="bookingdays" value="${query.daysnum }" />
			<input type="hidden" name="cargotypeid" value="${tRentproduct.cargotype.cargotypeid }" />
			<input type="hidden" name="office.id" value="${tRentproduct.office.id }" />
			<input type="hidden" name="time" value="${query.time }" />
			<input type="hidden" name="realscheid" value="${query.rentid }" />
			<input type="hidden" name="fromdateStr" value="${query.fromdateStr }" />
			<input type="hidden" name="departdateStr" value="<fmt:formatDate value="${query.departdate}" pattern="yyyy-MM-dd HH:mm:ss"/>" />	  	   
				  	   	   <div class="dp_information">
				  	   	   	      <div class="dp_info_title">
				  	   	   	      	  <h5>详情信息</h5>
				  	   	   	      </div>
				  	   	   	      <div class="product_i clearfix">
				  	   	   	      	  <div class="pro_l">
				  	   	   	      	  	   <div class="pro_prc">
				  	   	   	      	  	   	   <img src="${param.images }" />
				  	   	   	      	  	   </div>
				  	   	   	      	  	   <p class="prc_txt">${tRentproduct.cargotype.typename }</p>
				  	   	   	      	  </div>
				  	   	   	      	  <div class="product_explan">
				  	   	   	      	  	    <ul class="pro_list">
				  	   	   	      	  	    	 <li class="pro_si"><span class="prosi_tit">产品名称：</span><span class="prosi_txt">${genOrdername }</span></li>
				  	   	   	      	  	    	 <li class="pro_si"><span class="prosi_tit">用车时间：</span><span class="prosi_txt"><fmt:formatDate value="${query.fromdate}" pattern="yyyy年MM月dd日"/><fmt:formatDate value="${query.departdate}" pattern="HH:mm"/></span></li>
				  	   	   	      	  	    	 <li class="pro_si"><span class="prosi_tit">包车天数：</span><span class="prosi_txt">
				  	   	   	      	  	    	 <c:if test="${query.daysnum==0 }">0.5天</c:if>	
				  	   	   	      	  	    	 <c:if test="${query.daysnum!=0 }">${query.daysnum }天</c:if>	
				  	   	   	      	  	    	 </span></li>
				  	   	   	      	  	    	 <li class="pro_si"><span class="prosi_tit">服务车队：</span><span class="prosi_txt">${tRentproduct.office.name }</span></li>
				  	   	   	      	  	    	 <li class="pro_si"><span class="prosi_tit">特殊服务：</span><span class="prosi_txt">
				  	   	<c:if test="${query.office.iswifi == '1' }">无线wifi</c:if>
						<c:if test="${query.office.powersupply == '1' }">车载充电</c:if>
						<c:if test="${query.office.tablewater == '1' }">免费饮用水</c:if>
						<c:if test="${query.office.businesssuit == '1' }">商务正装</c:if>
						<c:if test="${query.office.paper == '1' }">免费纸巾</c:if>			
				  	   	   	      	  	    	 
				  	   	   	      	  	    	 </span></li>
				  	   	   	      	  	    </ul>
				  	   	   	      	  </div>
				  	   	   	      </div>
				  	   	   </div>
				  	   	   <div class="depage_main clearfix">
				  	   	   	    <div class="depage_box">
				  	   	   	    	  <ul class="depage_in_list">
 	   	    	  	  <li class="dp_ils"><label for="车辆数">车辆数：</label>	
 	   	    	  	  <input id="purchasenum" type="number" name="purchasenum" min="1" value="${not empty orders.purchasenum?orders.purchasenum:'1' }" />
 	   	    	  	</li>
 	   	    	  	  <li class="dp_ils"><label for="联系人姓名">联系人：</label>
 	   	    	  	  <input type="text" name="contacts" placeholder="联系人姓名"/>
 	   	    	  	  </li>
 	   	    	  	  <li class="dp_ils"><label for="联系电话">联系电话：</label>
 	   	    	  	  <input type="text" name="payertel" placeholder="输入手机号" value="${sessionScope.front_user.mobile}"/>
 	   	    	  	  <br><span id="mobilTip" ></span></li>
				  	   	   	    	  </ul>
				  	   	   	    	  <div class="trip_title">
				  	   	   	    	  	  <h5>行程备注</h5>
				  	   	   	    	  </div>
				  	   	   	    	  <div class="trip_lists">
				  	   	   	    	  	 <ul>
	  	   	   			<!-- <li class="dp_ils"><label for="上车地点">上车地点：</label>
<input type="text" id="departcityName" name="departcity.sitename" value="" autocomplete="off" >
<input type="hidden" name="departcity.siteid" value="">
 	   	   	    	  	 <br></li> -->
	  	   	   			<li class="dp_ils"><label for="上车地点">上车地点：</label>
<input type="text" class="address" id="suggestId" name="boardaddr" placeholder="第一天上车地点" required="required" value="${tDemands.sendAddress}" />
<div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
 	   	   	    	  	 <br></li>
	  	   	   			<li class="dp_ils"><label for="上车地点">行程备注：</label>
<textarea class="address" id="remark" name="remarks" placeholder="请填写每日详细行程（途径城市、景点等）"  value=""  style="height: 160px;"></textarea>
 	   	   	    	  	 <br></li>
				  	   	   	    	  	 </ul>
				  	   	   	    	  </div>
				  	   	   	    </div>
				  	   	        <div class="de_notice">
				  	   	        	 <p>重要提示：</p>
				  	   	        	 <p><c:set var="noticeType" value="${ORDER_TYPE_RENTPRODUCT_DAY }"/>
		<%-- <%@ include file="/WEB-INF/views/include/modules/rentproductNotice.jsp"%> --%>
1.如您的预订时间距离发车时间在12小时以内，为保证您的顺利出行，请保持您的电话畅通。<br>
2.司机食宿费一般由订车人安排，如不能安排，由司机向订车人收取相应的食宿补贴，标准为：住宿200元/晚、三餐80元/天。<br>
3.不含费用收费标准:<br>
(1)超时长费：当日用车总时长超过<c:if test="${query.daysnum==0 }">4</c:if><c:if test="${query.daysnum!=0 }">8</c:if>小时后，订车人主动要求增加用车时长，将按相应标准收取超时长费。标准：${tRentproduct.cargotype.typename }：${tRentproduct.outtimefee }元/小时。 <br>
(2)超公里费：当日用车总里程超过<c:if test="${query.daysnum!=0 }">${rentgroup.kms }</c:if>
		<c:if test="${query.daysnum==0 }">${rentgroup.kms/2 }</c:if>公里后，订车人主动要求增加用车里程，将按相应标准收取超公里费。标准：${tRentproduct.cargotype.typename }：${tRentproduct.outkmsfee }元/公里。 <br>
(3)因第三方收取的停车费、路桥费、摆渡费等由订车人现场自付，发票可自行保留。<br>
4.如产生不含费用项请在服务结束后，将钱面付司机。严禁司机额外乱收费，如发现可联系霞客约车客服核实退还。<br>
5.开具发票:如需发票，由霞客约车根据订单金额统一开具。请在服务完成后至我的账户—关于发票—立即开票填写开票信息，开票总金额为订单费用。<br>
		</p>
				  	   	        </div>
				  	   	   </div>
				  	   </div>
				       <div class="depage_right">
				       	    <div class="depage_cost">
				       	    	  <i class="cost_icon"></i>
				       	    	  <h5>费用明细：</h5>
				       	    	  <p style="text-align: justify;">费用包含：
				       	    	  <c:if test="${query.tabType eq '跨市'}">【套餐价8小时300公里/天】</c:if>
				       	    	  <c:if test="${query.tabType eq '市内'}">
				       	    	  	<c:if test="${query.daysnum==0 }">【套餐价4小时50公里/天】</c:if>
				       	    	  	<c:if test="${query.daysnum!=0 }"> 【套餐价8小时100公里/天】</c:if>
				       	    	 </c:if>
				       	    	 司机代驾服务费、车辆使用费、车辆油电费、空驶费、夜间服务费、司机小费。
</br>费用不含：超时服务费、超公里费、司机食宿费、第三方收费。
				       	    	  </p>
				       	    	  <p class="cost_ing">
				       	    	  	     <span>价格：</span>
				       	    	  	     <i ></i>
				       	    	  	     <span id="suitrtnprice">
				       	    	  	     <c:set var="totalPrice" value="${query.daysnum*tRentproduct.suitrtnprice }"/>
					${totalPrice}</span>
					                    <button class="reserve" id="subBtn" >预定</button>
				       	    	  </p>
				       	    </div></form>
				       	    <div class="depage_cancel">
				       	    	     <i class="cancel_icon"></i>
				       	    	     <h5>取消须知：</h5>
				       	    	     <p>
●该产品支持取消。<br>
●出行日期前72小时前取消，免收违约金；<br>
●出行日期前72小时至24小时取消，收取费用总额${sessionScope.front_user.office.flatType ne '2' or noticeType eq ORDER_TYPE_RENTPRODUCT_CUSTOM?'30%':'10%' }的违约金；<br>
●出行开始前24小时取消，收取费用总额50%的违约金；<br>
●超过发车时间不可退款。<br>
●如需改期，请申请取消后重新预订。<br>
				       	    	   </p>
				       	    </div>
				       </div>
				  </div>
			</div>
		</div>
	</body>
		<jsp:include page="/WEB-INF/views/layouts/foot.jsp"></jsp:include>
</html>
